<!DOCTYPE>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <style type="text/css">
 {
	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
}

/*
 * 完美轻拂动
 */
.clearfix:after{
	clear: both;
	display: block;
	content: '';
}

/*
 * IE6兼容问题的清除浮动
 */
.clearfix{
	zoom: 1;
}

/*
 * 左浮动
 */
.fl{
	float: left;
}

/*
 * 有浮动
 */
.fr{
	float: right;
}

/*
 * 安全距离，容器
 */

.container{
	width:100%;
	background: #eeeeee;
	/*padding:30px 60px 65px 30px;*/
}
.content{
	width:780px;
	background: #ffffff;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius: 8px;
	margin: 30px auto;
}
b,strong{
	font-weight: normal;
}
i,em{
	font-style: normal;
}
a{
	text-decoration: none;
}
li{
	list-style: none;
}
body,html{
	height: 100%;
	background-color: #0080C0;
}
.header{
    padding:30px 20px 10px 30px;
    color:#646464;
    font-size: 15px;
}
.header a{
    color:#646464;
    margin-left: 30px;
}
.header .top{
    width:100%;
    margin-bottom: 5px;
}
.header .bottom{
    width:130px;
}
.main{
    color:#686868;
    padding-bottom: 94px;
}
.main .title{
    padding:5px 0 5px 30px;
    height:30px;
    background: url("../images/border.png") no-repeat 0 5px;
    background-color: #e7f3f3;
    color:#333436;
    font-size:18px;
    line-height: 30px;
    /*margin-bottom: 30px;*/
}
.main .content{
    padding: 0 0 0 30px;
    width:750px;
}
.main .content .left,.main .content .right{
    width:50%;
}
.main a{
    display:inline-block;
    width:108px;
    height:17px;
    background: #eeeeee;
    color:#646464;
    padding:4px 0 4px 7px;
    font-size: 17px;
    line-height: 17px;
}
.main i{
    display:inline-block;
    width:25px;
    height:23px;
    background: url("../images/option.jpg") no-repeat 8px 8px;
}
.main label{
    font-size: 17px;
}
.main input{
    color:#686868;
    border:1px solid #cccccc;
    width:140px;
    height:15px;
    padding: 7px 0 6px 8px;
    outline: none;
}
.main input.mailbox{
    width:200px;
}
.main input.id{
    width:200px;
}
.main .content div{
    margin-bottom: 30px;
}
.main .content div.label{
    height:30px;
    line-height: 30px;
}
.main .content div.label label{
    display: inline-block;
    height:30px;
    line-height: 30px;
}
.main .content div .option{
    position: relative;
    display:inline-block;
    margin-bottom: -8px;
    width:144px;
    height:24px;
    border:1px solid #cccccc;
    padding: 2px;
}
.main .content div .option ul{
    display:none;
    position: absolute;
    top:29px;
    left:-1px;
    width:150px;
    background: #d7e3e3;
    font-size: 17px;
    color:#333333;
    z-index: 999;
}
.main .content div .option ul li{
    padding: 0 0 0 10px;
}
.main .content div .option ul li:hover{
    background: #0e8384;
}    	
    </style>
</head>
<body>
	<div class="container">
        <div class="content">
            <div class="header clearfix">
                <div class="top fl">当前位置>员工详细信息</div>
            </div>
            <div class="main">
                <div class="BasicInformation">
                    <div class="title">详细信息</div>
                </div>
                <div class="content clearfix">
                    <div class="left fl">
                        <div>
                            <label for="">&nbsp;&nbsp;&nbsp;&nbsp;用户名：</label>
                            <input name="username" id="stu_name" type="text" th:value="${staff.username }" readonly="readonly"/>
                        </div>
                         <div>
                            <label for="">真实姓名：</label>
                            <input name="name" id="birthday" type="text" th:value="${staff.name }" readonly="readonly" >
                        </div>
                        <div>
                            <label for="">出生日期：</label>
                            <input name="birthday" id="birthday" type="text" th:value="${staff.birthday }" readonly="readonly" >
                        </div>
                        <div>
                            <label for="">入职时间：</label>
                            <input  name="hire_date" type="text" th:value="${staff.hire_date }" readonly="readonly" >
                        </div>
                        <div>
                            <label for="">工作经历：</label>
                            <input  name="experience" type="text" th:value="${staff.experience }" readonly="readonly" >
                        </div>
                       
                        <div>
                            <label for="">身份标识：</label>
                            <input  name="flag" type="text" th:value="${staff.flag }" readonly="readonly" >
                        </div>
                    </div>
                    <div class="right fr">
                        <div>
                            <label for="">密码：</label>
                            <input name="password" id="stu_name" type="text" th:value="${staff.password }" readonly="readonly" />
                        </div>
                        <div>
                            <label for="">性别：</label>
                            <input name="sex" id="stu_name" type="text" th:value="${staff.sex }" readonly="readonly" />
                        </div>
                        <div>
                            <label for="">职位：</label>
                            <input name="position" type="text" th:value="${staff.position }" readonly="readonly">
                        </div>
                         <div>
                            <label for="">学历：</label>
                            <input name="position" type="text" th:value="${staff.qualification }" readonly="readonly" >
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>